Introduction

The first part of the app that you will code is an onboarding flow for your users. Onboarding flows are important to highlight the main features of the app or to provide a seamless way to register users. To create an onboarding flow you need to display UI elements and store user input.

You learned how to display UI elements in the Create the User Interface in Android course. You should also recall the different ways to retrieve, store and display data from the Working with data in Android course. This reading will provide you with an overview of these processes. You will use this information in the next exercise where you will be setting up the onboarding flow.

Displaying UI elements

There are several built-in components in Jetpack Compose that you can use to build the app and design an onboarding flow. Some of the components that you might find useful include Column , Text , TextInput and Image Composables. Let’s review these components briefly.

Column displays each child below the previous children with a vertical orientation. It can be used to position multiple Composables on the screen.

Row can be used to display a child next to another child components within the horizontal orientation. It can be used to position multiple Composables on the screen.

Text represents static text on the screen. It can be used to display text in your onboarding flow to explain a specific feature such as screen name or give instructions.

TextField allows users to enter text. This Composable is used to gather user input such as a username or password.

Image allows you to display images, providing more contextual information about a specific feature you want to highlight or conveying extra information with visual cues.

Button allows you to create buttons that users can click to perform an action. You can use buttons to enable users to navigate your onboarding flow or perform other actions.

To refresh your memory of how to work with these components, review the following lesson items in the Create the User Interface in Android course:

Most of the Composables allow you to specify custom modifiers that you can use to decorate or augment a Composable. For example, you can change the Composable's size, behavior and appearance and process user input. To obtain more information about modifiers, please revisit the Modifiers with layouts video in the Create the User Interface in Android course.

Overall, the best components to use will depend on what content you want to include in your onboarding flow. It may be helpful to experiment with different components and modifiers to see which ones work best for your needs.

Storing data

While most of the application data stay in the memory, you will need to persist certain pieces of information that are key to keeping track of specific data, especially when the user quits the application. For example, the user's details or the menu items. Android offers different ways to store data on the device.

The most suitable option for simple data independent of other values is to use the SharedPreferences . For example, to persist a value that indicates whether the user is logged in or not, you can leverage the SharedPreferences.putBoolean method. For storing more complex data such as a list of menu items, it is best to use a database. The Room persistence library provides an abstraction layer over the SQLite database. It allows you to write, modify, access and manage data stored in the database.

To obtain more information about storing independent data and storing data in a database, revisit the following lesson items in the Working with data in Android course:

Conclusion

In this reading, you recapped the different UI components that Jetpack Compose offers for implementing an onboarding flow. You also examined how to persist simple data on the device's persistent memory with the help of the shared preferences and how to store more complex data in the SQLite database with Room.